<template>
	<view>
		<up-navbar leftIconColor="#FFFFFF" leftIconSize="44rpx" :title="`${(id?'修改':'添加')}账号`" :autoBack="true" placeholder
			bgColor="transparent">
		</up-navbar>

		<view class="info_id">游戏ID</view>
		<view class="info_input">
			<up-input fontSize="52rpx" color='#ffffff' placeholder="输入需要添加的游戏ID" border="bottom" v-model="gameNo"></up-input>
		</view>

		<view class="info_confirm edyf_confirm" @click="confirm">{{id?'确定修改':'确定添加'}}</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from "vue"
	import {
		msg,
		back
	} from "@/utils/tool.js"
	import secondApi from "@/api/biz/second.js"
	import {
		onLoad
	} from "@dcloudio/uni-app"

	const gameNo = ref('');
	const confirm = () => {
		if (!gameNo.value) return msg("请输入游戏ID")
		if (id.value) {
			secondApi.updateUserGame({
				gameNo: gameNo.value,
				id: id.value
			}).then(res => {
				if (res.code === 0) {
					msg("修改成功");
					back()
				}
			})
		} else {
			secondApi.createUserGame({
				gameNo: gameNo.value
			}).then(res => {
				if (res.code === 0) {
					msg("添加成功");
					back()
				}
			})
		}

	}

	const info = () => {
		secondApi.getUserGame(id.value).then(res => {
			if (res.code === 0) {
				gameNo.value = res.data.gameNo;
			}
		})
	}

	const id = ref();
	onLoad((option) => {
		if (option.id) {
			id.value = option.id
			info()
		}
	})
</script>

<style>
	page {
		background: #1B1829;
	}
</style>
<style scoped lang="scss">
	.info_confirm {
		margin: 254rpx auto 0;

	}

	.info_input {
		width: 690rpx;
		margin-left: 30rpx;
		margin-top: 60rpx;

		:deep(.u-input) {
			padding: 0 0 20rpx !important;
			border-color: #403D4C !important;

			.u-input__content__field-wrapper__field {
				height: 60rpx !important;
			}
		}
	}

	.info_id {
		margin-top: 120rpx;
		font-weight: 400;
		font-size: 30rpx;
		color: #FFFFFF;
		margin-left: 30rpx;
	}
</style>